<!--
 * @Author: your name
 * @Date: 2021-01-12 17:41:00
 * @LastEditTime: 2021-05-13 11:35:03
-->
<template>
  <div class="shop-open">
    <van-nav-bar title="开通商品橱窗" fixed placeholder>
      <template #left><van-icon name="arrow-left" size="18" color="#333" /></template>
    </van-nav-bar>
    <!--  -->
    <section>
      <van-cell title="申请实名认证" center>
        <template #right-icon>
          <van-button size="small" type="danger" color="#FE2E4E" :disabled="isRealName !== '认证'" @click="handleCertification()" >{{ isRealName }}</van-button>
        </template>
      </van-cell>
      <div class="van-doc-demo-block__title">要求</div>
      <ul class="tip-group">
        <li class="flex"><div class="flex__item">个人主页视频数（公开且审核通过）</div>>=10条</li>
        <li class="flex"><div class="flex__item">账号粉丝量</div>>=1000</li>
      </ul>
    </section>
    <!--  -->
    <van-action-bar>
      <van-action-bar-button type="danger" text="立即开通" color="#FE2E4E" :disabled="isRealName !== '已认证'" @click="handleOpened()" />
    </van-action-bar>
  </div>
</template>

<script>
import { saveMyShopStatus } from '@api'
import { useStore } from 'vuex'
import { useRouter } from 'vue-router'
import { Toast, Dialog } from 'vant'
export default {
  setup () {
    // const { ctx } = getCurrentInstance()
    // ctx.$api.test()
    const store = useStore()

    // 用户信息
    const info = store.getters.userInfo

    // 认证状态
    const certificationStatus = {
      WAITING_REVIEW: '待审核',
      UNSUBMITTED: '认证', // 未提交
      AUDITED: '已认证', // 已通过
      REJECT: '已否决'
    }
    const isRealName = certificationStatus[info.isRealName]

    // 处理认证
    const handleCertification = () => {
      store.dispatch('auditeUserRealName')
    }

    // 处理开通
    const handleOpened = () => {
      console.log(info)
      Toast.loading({
        message: '开通中...',
        forbidClick: true
      })
      saveMyShopStatus().then(res => {
        const { resultCode, resultMsg } = res
        if (resultCode === '00100000') {
          Toast.success('开通成功')
          useRouter.push({ name: 'shopManage' })
        } else {
          Dialog.alert({
            message: resultMsg
          })
        }
      })
    }

    return {
      info,
      isRealName,
      handleCertification,
      handleOpened
    }
  }
}
</script>

<style scoped lang="scss">
@import './shopOpen.scss';
</style>
